// 启用该组件 tdesignUI框架不建议更改全部组件的大小
import { setAssemblySize } from "@/redux/modules/global/action";
import { connect } from "react-redux";
import { Dropdown, Button } from "tdesign-react";
import type { DropdownProps } from "tdesign-react";
import { Icon } from "tdesign-icons-react";
const AssemblySize = (props: any) => {
	const { assemblySize, setAssemblySize } = props;
	// setAssemblySize
	// 切换组件大小
	// const onClick = (e: MenuInfo) => {
	// 	setAssemblySize(e.key);
	// };
	const options = [
		{
			disabled: assemblySize == "middle",
			value: "middle",
			content: <span>默认</span>
		},
		{
			disabled: assemblySize == "large",
			value: "large",
			content: <span>大型</span>
		},
		{
			disabled: assemblySize == "small",
			value: "small",
			content: <span>小型</span>
		}
	];
	const clickHandler: DropdownProps["onClick"] = data => {
		setAssemblySize(data.value);
	};
	return (
		<Dropdown options={options} onClick={clickHandler}>
			<Button variant="text" suffix={<Icon name="chevron-down" size="16" />}>
				更多
			</Button>
		</Dropdown>
	);
};

const mapStateToProps = (state: any) => state.global;
const mapDispatchToProps = { setAssemblySize };
export default connect(mapStateToProps, mapDispatchToProps)(AssemblySize);
